<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜品管理后台列表</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="../../Res/LayUI/css/layui.css" media="all">
<script src="../../Res/JS/jquery-1.10.2.js" charset="utf-8"></script>
<script src="../../Res/JS/date.js" charset="utf-8"></script>
<script type="text/html" id="optime">  
  
  	{{dateFormat(d.optime)}}  
</script>
<link rel="stylesheet" href="../../Res/LayUI/css/modules/treeselect.css">
<!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>
<body>
	<div class="demoTable">
	  搜索:
	  <div class="layui-inline">
	    <input class="layui-input" name="manUser" id="demoReload" autocomplete="off" placeholder="输入用户名称">
	  </div>
	  <button class="layui-btn" data-type="reload">搜索</button>
	  <button class="layui-btn" id="useradd" data-type="add">增加</button>
	</div>
	<table class="layui-hide" id="ehyManager" lay-filter="demo"></table>
 
<script type="text/html" id="barDemo">
  <a class="layui-btn layui-btn-xs" lay-event="edit" id="imgUpdate">修改</a>
  <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
 
<script src="../../Res/LayUI/layui.js"></script>
<script>

layui.use(['laydate', 'laypage', 'layer', 'table', 'upload', 'element'], function(){
	  var laydate = layui.laydate //日期
	  ,laypage = layui.laypage //分页
	  ,layer = layui.layer //弹层
	  ,table = layui.table //表格
	  ,upload = layui.upload //上传
	  ,element = layui.element; //元素操作
	 
	  
	  //监听Tab切换
	  element.on('tab(demo)', function(data){
	    layer.msg('切换了:'+ this.innerHTML);
	    console.log(data);
	  });
	  
	  //执行一个 table 实例
	  table.render({
	     elem: '#ehyManager'
	    ,width:1110
	    ,height: 490
	    ,url: '../../ManagerAction/findAll' //数据接口
	    ,page: true //开启分页
	    ,limit: 10
	    ,method:'post'
	    ,cols: [[ //表头
	       {type:'checkbox', fixed: 'left'}
	      ,{field: 'manId', title: '管理者ID', width:140, fixed: 'left'}
	      ,{field: 'mealId', title: '餐馆名称', width:140}
	      ,{field: 'manUser', title: '管理者账号', width:140}
	      ,{field: 'manPwd', title: '管理者密码', width:140}
	      ,{field: 'manPhone',title: '管理者电话号码', width: 140}
	      ,{field: 'manRemark', title: '管理者备注', width:140}
	      ,{field: 'isva', title: '是否有效', width:140}
	      ,{field: 'oper', title: '操作者', width:140}
	      ,{fixed: 'right',title: '操作', width: 200, align:'center', toolbar: '#barDemo'}
	    ]]
	  	  ,id:"testReload"
		  ,done: function(res, curr, count){
		  	$("[data-field='manId']").css('display','none');
		  	$("[data-field='isva']").css('display','none');
		  	$("[data-field='mealId']").css('display','none');
		  }
	  });
	  
	  //监听工具条
	  /*
	  
		 删除的方法
		 
	  */
	  table.on('tool(demo)', function(obj){ //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
	      var row = obj.data //获得当前行数据
	      ,layEvent = obj.event; //获得 lay-event 对应的值
	      if(layEvent === 'del'){
		      var manId=row.manId;
		      layer.confirm('确认删除？', function(index){
			      layer.close(index);
			      //使用jquery的ajax方式向后台提交数据
				  var url = "../../ManagerAction/deleteMana";
				  var data={"manId":manId};
				  $.post(url,data,function(mssage){
					   if(mssage=="ok"){
							layer.msg('删除成功', {
								  icon: 1,
								  time: 1000 //1秒关闭(如果不配置，默认是3秒)
								}, function(index, item){
									location.reload(); // 页面刷新
							});
						}
				  });
		      });
		    } else if(layEvent ==='edit'){
		    	var manId=row.manId;
		        //使用jquery的ajax方式向后台提交数据
				var url = "../../ManagerAction/showManaUpdate";
				
				var datas={manId:manId};
				$.post(url,datas,function(data){
					 
					 layer.open({
						  type: 2,
						  area : ['60%' , '70%'],//弹出框大小
						  shift:1,//弹出框动画效果
						  content: ['manager_update.html','on'], //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
					 	  success:function(layero,index){
					 		  var body = layer.getChildFrame('body',index);//确定两个页面之间的父子关系
					 		  var iframeWin = window[layero.find('iframe')[0]['name']];//子页面对象
					 		  // console.log(body.html()); //得到iframe页的body内容
					 		  body.find("#manId").val(data[0].manId);
					 		  body.find("#manUser").val(data[0].manUser);
					 		  body.find('#manPwd').val(data[0].manPwd);
					 		  body.find('#manPhone').val(data[0].manPhone);
					 		  body.find('#manRemark').val(data[0].manRemark);
					 		  body.find("#isva").val(data[0].isva);
					 		  body.find("#oper").val(data[0].oper);
					 		  body.find("#role").val(data[0].roleId);
					 	  }			 
					}); 
					
				},"JSON");
		    }
	  });
	  
	  /*条件模糊查询*/
	  var $ = layui.$;
	  $('.demoTable .layui-btn').on('click', function(){
		 var demoReload = $('#demoReload').val();
		 //执行重载
	     table.reload('testReload', {
	       page: {
	         curr: 1 //重新从第 1 页开始
	       }
	       ,where: {
	    	   manUser:demoReload
	       }
	     });
	  });
	  /*
	 	
	  	增加
	  
	  */
	  
	  $('#useradd').on('click',function(){
		 layer.open({
			  type: 2,
			  area : ['60%' , '70%'],//弹出框大小
			  shift:1,//弹出框动画效果
			  content: ['manager_add.html','on'] //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
		 }); 
	  }); 
});
	  
	  
</script>
</body>
</html>

	  